<template>
    <div>
        <img style="height: 250px;width: 100%;background-color: #2f344c;" src="../assets/zuopin.png">
        <el-breadcrumb separator-class="el-icon-arrow-right">
            <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item>版权登记</el-breadcrumb-item>
            <el-breadcrumb-item>作品登记</el-breadcrumb-item>
        </el-breadcrumb>
        <el-divider></el-divider>
        <el-divider></el-divider>
        <el-row>
            <el-col :span="8">
                <el-card :body-style="{ paddingLeft: '30px' }" shadow="hover">
                    <img style="padding-left:20%;" src="../assets/z11.png" class="image">
                    <div style="padding: 14px;">
                        <span>作品著作权登记申请</span>
                        <div class="bottom clearfix">
                            <el-button type="text" class="button" @click="shenqing">立即登记</el-button>
                        </div>
                    </div>
                </el-card>
            </el-col>
            <el-col :span="8">
                <el-card shadow="hover">
                    <img style="padding-left:20%;" src="../assets/z61.png" class="image">
                    <div style="padding: 14px;">
                        <span>作品著作权和合同变更或补充登记申请</span>
                        <div class="bottom clearfix">
                            <el-button type="text" class="button" style="padding-top: 42px;">立即登记</el-button>
                        </div>
                    </div>
                </el-card>
            </el-col>
            <el-col :span="8">
                <el-card shadow="hover">
                    <img style="padding-left:20%;" src="../assets/z62.png" class="image">
                    <div style="padding: 14px;">
                        <span>撤销作品著作权和合同登记申请</span>
                        <div class="bottom clearfix">
                            <el-button type="text" class="button">立即登记</el-button>
                        </div>
                    </div>
                </el-card>
            </el-col>
        </el-row>
        <el-divider></el-divider>
        <el-row>
            <el-col :span="8">
                <el-card shadow="hover">
                    <img style="padding-left:20%;" src="../assets/z63.png" class="image">
                    <div style="padding: 14px;">
                        <span>撤回作品著作权和合同登记申请</span>
                        <div class="bottom clearfix">
                            <el-button type="text" class="button">立即登记</el-button>
                        </div>
                    </div>
                </el-card>
            </el-col>
            <el-col :span="8">
                <el-card shadow="hover">
                    <img style="padding-left:20%;" src="../assets/z65.png" class="image">
                    <div style="padding: 14px;">
                        <span>复制登记档案申请</span>
                        <div class="bottom clearfix">
                            <el-button type="text" class="button">立即登记</el-button>
                        </div>
                    </div>
                </el-card>
            </el-col>
            <!--<el-col :span="8">
                <el-card shadow="hover">
                    <img style="padding-left:20%;" src="../assets/R44.png" class="image">
                    <div style="padding: 14px;">
                        <span>撤销或放弃计算机软件登记申请</span>
                        <div class="bottom clearfix">
                            <el-button type="text" class="button">操作按钮</el-button>
                        </div>
                    </div>
                </el-card>
            </el-col>-->
        </el-row>
        <el-divider></el-divider>
    </div>
</template>

<script>
    export default {
        data() {
            return {
            }
        },
        methods: {
            shenqing() {
                this.$router.push("/workApply");
            }
        }
    }
</script>

<style scoped>
    .el-button {
        padding-top: 60px;
        align-items: center;
    }

    .el-row {
        padding-left: 10%;
        padding-right: 10%;
    }

    .el-card {
        height: 300px;
        width: 300px;
    }

    .button {
        padding-left: 32%;
    }
</style>